<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Static Block</title>
<link href="css/map.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.7.js"></script>
<script type="text/javascript" src="js/ArrayList.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/json2.js"></script>
<script type="text/javascript" src="js/map.js"></script>
<script type="text/javascript" src="js/entry_control.js"></script>
<script type="text/javascript" src="js/canvas.js"></script>
<script type="text/javascript" src="js/triangle.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		cav = document.getElementById("canvas");
		cav.setAttribute('width', 1800);
		cav.setAttribute('height', 1800);
		var menuNode = $("<div id='menu' style='z-index:9999;'></div>");
		var wrapper = $("<div id='wrapper' style='height:" + COLUMN_NUM * 45 + "px;width:" + ROW_NUM * 45 + "px;'></div>");
		$("body").append(menuNode);
		$("body").append(wrapper);
		canvasTool = new CanvasUtils();
		entryCtrl = new Entry_Controller("#canvas");
		menu = new MenuController(menuNode, {
			tiles : TILES,
			principle : PRINCIPLE,
			model : 0
		});
		menuNode.append("<p id='start'>请地图上单击选择起点</p><p id='end'>请地图上单击选择终点</p><p><input type='button' id='route' value='寻路'/></p>");
		map = new MapEntity({
			row : ROW_NUM,
			col : COLUMN_NUM,
			parent : wrapper,
			menu : menu,
			ctool : canvasTool,
			entryCtrl : entryCtrl,
			height : 45,
			width : 45
		});
		map.loadAllPoints();
	});
</script>
</head>
<body>
	<div id="frame">
		<canvas id="canvas"
			style="width: 1800px; height: 1800px; position: absolute; z-index: 100; top: 8px; left: 8px;">
		</canvas>
	</div>
</body>
</html>